<template>
  <div>
    <el-row style="margin-bottom:20px;display:flex;justify-content:flex-start">
      <selecteq :selecteqid.sync="selecteqid" style="width:20%;margin-right:10px"></selecteq>
      <el-input placeholder="规格型号" style="width:20%;margin-right:10px" v-model="scale"></el-input>
      <selectorg @getselectorgid="getselectorgid" style="width:20%;margin-right:10px" clearable></selectorg>
      <el-date-picker
        v-model="verifiy"
        style="margin-right:10px"
        type="daterange"
        rangeSeparator="至"
        startPlaceholder="核查实施日期"
        endPlaceholder="核查实施日期"
        valueFormat="yyyy-MM-dd"
      ></el-date-picker>
      <el-button size="mini" type="primary" @click="getperiolist">搜索</el-button>
    </el-row>

    <el-row>
      <el-button size="mini" @click="addcheckplan">添加核查计划</el-button>
      <el-button size="mini" type="primary" @click="amandper">编辑</el-button>
      <el-button size="mini" type="success" @click="deleteper">删除</el-button>
      <el-button size="mini" type="info" @click="daochu">导出</el-button>
    </el-row>
    <el-divider></el-divider>
    <checktable
      :tableData="periodate"
      :pagobj.sync="pagobj"
      @itemvals="itemvals"
      :itemval1.sync="itemval1"
      id="tableExcel"
    ></checktable>
    <addcheck
      v-if="ischeck"
      :addcar.sync="changelist"
      :itemvalname="itemvalname"
      :chousebtn="btnvalue"
    ></addcheck>
  </div>
</template>

<script>
import addcheck from "~/components/apparatus/periodcheck/addcheck.vue";
import checktable from "~/components/apparatus/periodcheck/checktable.vue";
import selecteq from "~/components/common/selecteq.vue";
import selectorg from "~/components/common/selectorg.vue";
import FileSaver from "file-saver";
import XLSX from "xlsx";

export default {
  components: {
    addcheck,
    checktable,
    selecteq,
    selectorg
  },
  data() {
    return {
      itemvalname: {},
      dialogVisible: false,
      ts: this.newStore(),
      ischeck: false, // 添加弹窗
      btnvalue: 0,
      scale: "",
      swage: "",
      wdate: "",
      itemval1: [], // 从表格获取点击的次数
      periodate: [],
      selecteqid: {}, // 设备名称
      verifiy: [], // 日期
      itemval: [], // 点击获取的值
      caridarr: [], // 选中的id
      branchid: "",
      changelist: "",
      verifiytime1: "",
      verifiytime2: "",
      btnvalue: 0, // 判断是编辑还是核查
      // 分页
      pagobj: {
        currentPage3: 1,
        pagesize: 10,
        total: 10
      }
    };
  },
  created() {
    this.getyear();
    this.getperiolist();
  },
  watch: {
    changelist() {
      this.getperiolist();
    }
  },
  methods: {
    getyear() {
      const time = new Date();
      const year = time.getFullYear();
      this.verifiy = [`${year}-01-01`, `${year}-12-31`];
      console.log(this.jddate);
    },
    // 编辑信息
    amandper() {
      this.btnvalue = 2;
      if (this.itemval1.length == 1) {
        let itemvals = {};
        itemvals = this.itemval[0];
        this.itemvalname = itemvals;
        // console.log(this.itemvalname,'44')
        this.reload("ischeck");
      } else if (this.itemval1.length == 0) {
        this.$message("请勾选一个仪器设备");
      } else {
        this.$message("只能选择一个核查计划");
      }
      // alert(this.caridarr.length)
      // this.btnvalue = 2;
      // //this.reload("isaddmain");
      // if (this.itemval.length == 1) {
      //   this.reload("ischeck");
      // } else if (this.itemval.length == 0) {
      //   this.$alert("请勾选一个核查计划", "提示");
      // } else {
      //   this.$alert("只能选择一个核查计划", "提示");
      // }
    },
    // 删除
    deleteper() {
      // console.log(this.caridarr,'iiiiiiiiiiiiiiii');

      if (this.caridarr.length > 1) {
        this.$confirm("是否批量删除核查计划?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          const req = {
            handle:
              "DD5D108B99FC12B7BAB3E6EAE5C936EF5FBB6F4BAE9BBB73F8B82A84C4C3C33D",
            id: this.caridarr
          };
          this.spost(this.ts, "/mainservlet", req).then(ts => {
            if (ts.d.sflag == "success") {
              this.getperiolist();
              setTimeout(
                this.$message({
                  type: "success",
                  message: "删除成功!"
                }),
                6000
              );

              // this.$emit("addcar", this.branchidlist);
            }
          });
        });
      } else if (this.caridarr.length == 1) {
        this.$confirm("是否删除该核查计划?", "提示", {
          confirmButtonText: "确定",
          cancelButtonText: "取消",
          type: "warning"
        }).then(() => {
          const req = {
            handle:
              "DD5D108B99FC12B7BAB3E6EAE5C936EF5FBB6F4BAE9BBB73F8B82A84C4C3C33D",
            id: this.caridarr
          };
          this.spost(this.ts, "/mainservlet", req).then(ts => {
            if (ts.d.sflag == "success") {
              this.$message({
                type: "success",
                message: "删除成功!"
              });
              this.getperiolist();
              // this.$emit("addcar", this.branchidlist);
            }
          });
        });
      } else {
        this.$alert("请选择期间检查", "提示");
      }
    },
    // table传给父组件
    itemvals(val) {
      // console.log(val, "wwwwww");
      this.itemval = val;
      this.caridarr = [];
      // this.caridarr2=[];
      for (let i = 0; i < this.itemval1.length; i++) {
        this.caridarr.push(this.itemval1[i].hash.id);
        // this.caridarr2.push(this.itemval[i].hash.id)
      }
      // console.log(this.caridarr, "23");
    },
    // 获取部门
    getselectorgid(val) {
      this.branchid = val;
    },
    // 添加计划
    addcheckplan() {
      this.btnvalue = 1;
      this.reload("ischeck");
    },
    // 组件刷新
    reload(partsname) {
      // console.log(partsname);

      this[partsname] = false;
      this.$nextTick(() => {
        this[partsname] = true;
      });
    },
    // 获得列表
    getperiolist() {
      if (this.verifiy) {
        this.verifiytime1 = this.verifiy[0];
        this.verifiytime2 = this.verifiy[1];
      } else {
        this.verifiytime1 = "";
        this.verifiytime2 = "";
      }
      const req = {
        handle:
          "DD5D108B99FC12B7BAB3E6EAE5C936EF5FBB6F4BAE9BBB73CD3A43E9777C4E90",
        eid: this.selecteqid.id,
        scale: this.scale,
        dutyorg: this.branchid,
        check_time_begin: this.verifiytime1,
        check_time_end: this.verifiytime2,
        start: (this.pagobj.currentPage3 - 1) * this.pagobj.pagesize,
        limit: this.pagobj.pagesize
      };
      this.spost(this.ts, "/mainservlet", req).then(ts => {
        if (ts.d.sflag == "success") {
          this.periodate = ts.d.data.operation1;
          console.log(this.periodate)
          this.pagobj.total = parseInt(ts.d.data.operation2[0].hash.allrs);
          // console.log(ts.d.data, "9090");
        }
      });
    },
    //导出功能
    daochu() {
      if (this.periodate.length == 0) {
        this.$message({
          type: "error",
          message: "导出数据为空,无法导出"
        });
        return false;
      }
      var wb = XLSX.utils.table_to_book(document.querySelector("#tableExcel"));
      var wbout = XLSX.write(wb, {
        bookType: "xlsx",
        bookSST: true,
        type: "array"
      });
      try {
        FileSaver.saveAs(
          new Blob([wbout], { type: "application/octet-stream" }),
          "sheetjs.xlsx"
        );
      } catch (e) {
        if (typeof console !== "undefined") console.log(e, wbout);
      }
      return wbout;
    }
  }
};
</script>
<style>
.cell {
  text-align: center;
}
.el-range-separator {
  width: 10% !important;
}
</style>

